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ABSTRACT 


This article discusses devising an IoT system to monitor weather parameters 
and gas pollutants in the air along with an HTML web-based application. 
Weather parameters measured include; speed and direction of the wind, 
rainfall, air temperature and humidity, barometric pressure, and UV index. On 
the other side, the gases measured are; ammonia, hydrogen, methane, ozone, 


carbon monoxide, and carbon dioxide. This article is introducing a technique 
to send all parameter data. All parameters read by each sensor are converted 
Keywords: into a string then joined into a string dataset, where this dataset is sent to the 
server periodically. On the UI side, the dataset that has been downloaded from 


Air quality the server-parsed for processing and then displayed. This system uses Google 
ESP32 Firebase as a real-time database server for sensor data. Also, using the GitHub 
Microcontr oller platform as a web hosting. The web application uses the HTML programming 
Weather station platform. The results of this study indicate that the device operates 
Web application successfully to provide information about the weather and gases condition as 
real-time data. 
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1. INTRODUCTION 

Today, information system is very important to human life, such as to inform the weather [1], health 
[2]-[6], warning system, and more. In human daily activities are inseparable from the weather and air 
conditions in the place where they live and work. This of course will affect health conditions. Especially 
during the current COVID-19 (corona virus disease 2019) pandemic, environmental conditions are an 
important concern in maintaining a healthy body. Information about weather conditions can be of great use 
when considering activities outside the home or office. Besides, information about the levels of pollutant 
gases in the air is also very important to determine the potential for air pollution which greatly affects the 
health of the body. 

Several studies have been conducted to measure and monitor weather conditions and gas levels in 
the air, such as the internet of things-based system conducted by Kodali et al. [7]. Weather stations with 
mobile applications have also been carried out by Munandar et al. [8]. Research on weather station design 
using a microcontroller board was carried out by Saini et al. [9] and Solano et al. [10], who also used a 
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Raspberry Pi board by Savic et al. [11]. There is also research on weather stations used for agricultural 
purposes that have been done by Navulur et al. [12] and Sekaran et al. [13]. The assessment of weather 
conditions is also useful for determining the potential of wind energy in Oman, which is described in the Al- 
Yahyai article [14]. Mary et al. also aimed to design three generations of the automatic weather station 
prototype [15]. 

Different from previous research, the weather station device in this study is equipped with a feature 
for measuring pollutant gases. This feature is used to obtain data on air quality conditions. This article also 
introduces the ESP32 data transmission method. Data delivery to a real-time database is done directly every 1 
minute. Then the database stores the data in JSON form which can be processed by an HTML-based 
program. The ESP32 microcontroller board is used to read sensors, process data, upload to the server, and 
also store data to a micro SD card. Just like its family, the ESP8266 is a microcontroller module type 
Arduino [16]-[21] which is very suitable for use in automation system applications that utilize the internet 
network [22]-[26]. Boards based on dual-processor chips made by Espressif are very commonly used on the 
Internet of Things-based applications such as [27]-[28]. 

The data obtained is then uploaded to a cloud real-time database and accessed by an HTML-based 
web application that is hosted on the GitHub platform. The use of web applications to facilitate user access 
can be done anywhere and anytime. The HTML platform is very suitable to be used for this purpose. The 
web interface is also made attractive and informative for the users. 


2. PROCEDURE 

This research consists of 3 parts, namely; field-deployed hardware, real-time databases, and web 
applications. The hardware consists of a power supply, sensors, and a microcontroller. Database using 
Google Firebase cloud server and web hosting using the GitHub platform. For web monitoring applications 
using the HTML platform. 


2.1. System design 

Figure | explains the design of the system which consists of; sensors, microcontroller, router, and 
modem are installed on the equipment in the field. They are supplied by a 9 V adapter. Measurement of 
weather parameters using an anemometer, wind vane, and rain gauge which is integrated with DHT 11 and 
BMP sensors in a shield module. This shield module sends data via serial communication to the 
microcontroller. The data that has been processed is then uploaded to the database server and stored on a 
micro SD card. From the user's side, a web-based application was created for monitoring all measured 
parameters. This application can be accessed at the address http://ftmm.unair.ac.id/airfeelproject. Data 
acquisition on this web application is carried out at a 2-minute interval. 
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Figure 1. System block diagram 
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2.2. Hardware design 

The hardware installed in the field consists of a PCB assembled for the gas sensors, weather station 
shield, DC/DC step down converter, and the Nodemcu ESP32 development kit C as microcontroller board 
[29]-[34]. several researchers have also developed various automation systems using various microcontroller 
boards [35]-[42]. Figure 2 shows the connections between the components used in this field system. There 
are 4 sensors which have an analog signal output, namely MQ-8, MQ-131, MQ-135, and a UV sensor. The 
use of the ESP32 board is suitable because it has many pins that can be used as an analog to digital converter 
(ADC) input. 
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Another gas sensor, the Parallax brand, has a digital signal output, namely CO and CO2. Their 
output pins are connected to the general digital pins on the ESP32. Then the MQ-4 sensor has a digital signal 
output that is sent via 12c communication on the SDA and SCL pins. Then the weather shield sends weather 
parameter data via serial communication on the TX and RX pins. This device also uses a 16x2 LCD as an 
indicator of SSID and IP on the Wi-fi network used. All components in this device are supplied by one 9 V 
adapter. The power supply is then separated into 2 DC/DC step-down converters for the right voltage 
specifications for the ESP32 board and sensors. 
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Figure 2. Schematic diagram of the field system device 





2.3. Real-time database 

This study utilizes an open-source facility provided free by Google Firebase. Firebase gives the 
Real-time database, in Firebase the data is stored as JSON and synchronized continuously to each associated 
client this means that the client need not has to make a call to fetch data changes, Firebase takes the initiative 
and notifies the application every time the data is changed this means unless the data at server get changed no 
call or response will be done which leads to optimum utilization of bandwidth [43]. The feature used in this 
study is a real-time database. This feature is a cloud-hosted database. A series of datasets are put together in 
the process on the microcontroller and then sent to the database in the form of a string containing the value of 
each sensor parameter with a separate comma. 


2.4. Web-based application 

This application is used to observe changes in the value of all measured parameters. Created using 
HTML programming, there are a total of 13 actual parameters plus 2-time parameters, namely date and time. 
Especially for time parameters, data is retrieved from the NTP server. This data is taken every measurement 
made by the microcontroller. Thus, the measurement dataset will always correspond to the actual time in the 
field. 


3. RESEARCH METHOD 
3.1. Field station system 

As mentioned in the previous section, all sensors, microcontrollers, and routers are placed in the 
field for the actual measurement. The placement is on the top of Nanizar Zaman Joenoes Building, Airlangga 
University, Surabaya, Indonesia. This building has coordinates -7.266329, 112.78436. Installation of the 
device is on the highest structure in the building which has an altitude of about 80 meters. All of the fieldsets 
shown in Figure 3 (a) are protected in an aluminum panel. This panel can protect electronic devices from heat 
and rain. As shown in Figure 3 (b), the anemometer used is a vertical wind turbine that has 3 spoon-shaped 
lattices to catch the wind. The vertical turbine type makes it capable of catching wind from all directions. A 
wind vane is used to measure the direction of wind arrival. This fin is used so that the wind vane can rotate in 
the direction of the wind. Rainfall measurements are made with a rain gauge. As an indicator of the sun's 
lighting conditions, the S12SD UV sensor is used. 
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Figure 3. Installation of the weather station field system on the top of the building, (a) Controller and gas 
sensors setup, (b) Anemometer, wind vane, rain gauge, and UV sensor probe set up on the field 


3.2. Firmware design 

This firmware is an embedded program that is made as to the operational core of the hardware 
station field. This program is made with the Arduino IDE. The program workflow embedded in the 
microcontroller is shown in Figure 4 This program begins with a declaration of all libraries and all variables. 
Then enter the main program in the infinite loop. In this main program, the process begins with reading all 
the gas sensors, followed by reading the weather data from the weather station shield. After this, the network 
is connected again to ensure that the equipment is still connected to the local network. Then the process of 
parsing all sensor data. All data is concatenated as a comma-separated string. This is done to simplify the 
data split process in the client application. The data that has been collected from the sensor is then formulated 
into an equation to produce the actual data unit reading then this dataset is saved to SD in .csv form. The next 
process is uploading data to a real-time database. If the connection is interrupted and the database responds to 
a failed upload, the system will reset. But if not, the system work will continue into the loop process. If the 
loop has occurred 10 times, the system will reset. 
















Upload data success? Reset device 
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Figure 4. Workflow of the field program 


3.3. Web-based UI (user interface) design 
Figure 5 shows the UI display on a web page created for monitoring weather station devices. All 
measurement data for weather and air gas parameters are displayed in numerical form. This web application 
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design is made attractive and informative, making it easier for users to observe weather conditions and air gas 
levels around the location of field hardware placement. 
€ Œ â airfeelproject.github.iio * LE. a Q : 
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Figure 5. UI real-time display on web browser 
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3.4. Data traffic 

The field device will upload the dataset every 1 minute. The data is then stored in a real-time 
database. Uploaded data is always replaced with data afterward, so this database storage is not permanent, 
only temporary. In the web application, data requests are made in 2-minute intervals. Each time during this 
period, the application will request data access data to the real-time database to be displayed in text form on 
the database web page. Once this data is obtained by the client application, it is then processed and displayed 
on a web page. 


4. RESULT AND DISCUSSION 
4.1. Field system work 

This system works well supported by a good internet connection. Internet connection is very 
dependent on the performance of the router and 4G modem to get a cellular signal in the field. The voltage 
supply for each sensor is provided separately in 2 DC/DC step-down converters. Overall, this field device 
requires an AC supply voltage of 220V and a current of around 0.08A, so the total power for operation of this 
device is around 17Watt AC. 


4.2. Monitoring system work 

A survey of the level of interest and informativeness of this monitoring web page has been 
conducted to assess the quality of the UI designed. The survey results showed that 100% of 32 
correspondents stated that the web monitoring page design was interesting and informative. 


4.3. Data analysis 

The UI web application does the request and receives real-time data at a 2-minute interval. So 
normally, all data changes once every 2 minutes. This application requests data to the Firebase server at this 
interval. Data retrieval on-field device is correct in terms of time. However, data transmission and data 
reception are highly dependent on the quality of the network connection at the location. There may be 
network connection interruptions at certain times such as when it rains or the weather is not supportive. This 
is also influenced by the performance of the 4G modem and router used. This test was conducted from 10:00 
a.m. on November 1, 2020, to 10:00 a.m. on November 2, 2020. Data is taken from SD Card storage. All data 
is stored in one .csv file. 

Figure 6 shows the other 4 weather parameters, including the UV index at the location, Figure 6(a) 
UV index, 6(b) air ambient temperature, 6(c) humidity, and 6(d) barometric pressure. Mostly it has more than 
15 indexes, the change of ambient temperature at location over a day and night, actual humidity, and 
barometric pressure at the location which has about 90-meter height above the sea level. Figure 7 shows the 
wind distribution at the location. Most winds come from the North of the location with a 3.2 m/s speed on 
average. 
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Figure 6. The weather station sensor readings, (a) UV index, (b) Air ambient temperature, (c) Humidity, and 
(d) Barometric pressure 
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Figure 7. Windrose of direction and speed measurement 


Figure 8 shows the changes of each gas composition in the air for over a day and night. The 
measurement changes follow the actual weather condition and daytime. Based on the real data captured from 
SD Card, all of the weather parameters will change dramatically when the condition is cloudy and raining. It 
also happened to gas readings. The changes occur because the composition of the particles in the air also 
changes. 
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Figure 8. All pollutant gases measurement 


5. CONCLUSION 

The design of a weather station system and measurement of 6 kinds of pollutant gases contained in 
the air were successfully made to observe actual weather and air condition. The field test shows that all 
measured weather parameters, including wind direction and speed, rainfall, UV index, air temperature and 
humidity, and barometric pressure have accurate and reasonable measurement results. The measurement 
results show changes in the value of the parameters in | daily cycle. The value of gas parameters measured in 
1 daily cycle also shows a reasonable result. The UI web application is very useful to give real-time 
information about all parameters every 2 minutes via public network and Firebase. Offline data storage on 
the SD card can be stored and can be accessed properly for users who want to get measurement history for a 
certain period. The future direction of improving this proposed study is developing the detection of the severe 
level of gases in the system and indicating the found level of gases that reach the critical level on the web- 
based application or smart devices. 
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